@include('Home.head')
<body>
<div class="container" id="app">
    @include('Home.member.header')
    {{ csrf_field() }}
    <div class="my-nav-bar">
        <ol class="am-breadcrumb">
            <li><a href="#">首页</a></li>
            <li><a href="#">代理申请</a></li>
        </ol>
    </div>
    <div class="cart-panel">
        <div class="withdrawals-panel">
            <h2 class="checkout-h2"><span class="am-badge am-round am-badge-warning ">1</span> 代理类型</h2>
            <form class="am-form">
                <div class="am-radio up-radio-item">
                    <label>
                        <input type="radio" name="doc-radio-1" value="0" v-model="address.type" checked>
                       省代理
                    </label>
                </div>
                <div class="am-radio up-radio-item up-radio-item2">
                    <label>
                        <input type="radio" name="doc-radio-1" value="1" v-model="address.type">
                        市代理
                    </label>
                </div>
                <div class="am-radio up-radio-item up-radio-item3">
                    <label>
                        <input type="radio" name="doc-radio-1" value="2" v-model="address.type">
                        县代理
                    </label>
                </div>

                <div class="gray-panel">
                    <div class="paoduct-title-panel">
                        <h2 class="checkout-h2"><span class="am-badge am-round am-badge-warning ">2</span> 申请城市</h2>
                            <p>
                            <div data-toggle="distpicker">
                                <label class="sr-only" for="province1">Province</label>
                                <select id="province1" v-model="address.province" required>
                                </select>
                                <div class="form-group">
                                    <label for="city1">City</label>
                                    <select class="form-control" id="city1" v-model="address.city" required>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label class="sr-only" for="district1" >District</label>
                                    <select class="form-control" id="district1" v-model="address.district">
                                    </select>
                                </div>
                            </div>
                            </p>
                    </div>
                </div>
                <p class="am-text-center"><button type="button" class="am-btn am-btn-danger am-radius am-btn-block" v-on:click="doApply()">立即申请</button></p>
            </form>

            <h2 class="checkout-h2"><span class="am-badge am-round am-badge-warning ">！</span> 申请进度</h2>
            <div class="withdrawals-panel">
                <table class="am-table am-table-striped am-table-hover comm-table">
                    <thead>
                    <tr>
                        <th>申请城市</th>
                        <th>代理类型</th>
                        <th>状态</th>
                        <th>日期</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="val in applyList">
                        <td>
                            <span style="" v-show="val.type==0">@{{ val.province }}</span>
                            <span v-show="val.type==1">@{{ val.city }}</span>
                            <span v-show="val.type==2">@{{ val.district }}</span>
                        </td>
                        <td>
                            <span v-if="val.type==0">省代理 </span>
                            <span v-if="val.type==1">市代理 </span>
                            <span v-if="val.type==2">县代理 </span>
                        </td>
                        <td>
                           <span v-show="val.status == 0">待审核</span>
                            <span v-show="val.status == 1">通过</span>
                            <span v-show="val.status == 2">拒绝</span>
                            <span v-show="val.status == 3">回收</span>
                        </td>
                        <td>@{{ val.created_at }}</td>
                    </tr>
                    </tbody>
                </table>
            </div>

    </div>
    @include('Home.foot')
</div>
</body>
<script src="{{ URL::asset('js/address/distpicker.data.js') }}"></script>
<script src="{{ URL::asset('js/address/distpicker.js') }}"></script>
<script src="{{ URL::asset('js/address/main.js') }}"></script>
<script>
    var app = new Vue({
        el: "#app",
        data: {
            title:'代理申请',
            address: {
                'type':'0',
                'province':'北京市',
                'city':'',
                'district':'',
                'status':0,
            },
            applyList:[]
        },
        methods: {
            initialize: function () {
                $.post("/home/member/editInfo", {'_token': '{{csrf_token()}}','class':'applylist'}, function (res) {
                    if (res.code) {
                        app.applyList = res.data;
                    }
                });
            },
            //代理申请
            doApply:function(){
                var that = this
                $.post("/home/member/editInfo", {'_token': '{{csrf_token()}}','class':'apply',address:app.address}, function (res) {
                    if (res.code) {
                        layer.msg(res.data);
                        app.applyList = [];
                        that.initialize();
                    } else {
                        layer.msg(res.data);
                    }
                });
            }
        },
        //自动执行
        mounted: function () {
            this.initialize();
        },
    })
</script>
</html>